<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />

        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

       <script type="text/javascript" src="/js/visualization/map.js"></script>
       <script type="text/javascript" src="/js/visualization/ProjectedOverlay.js"></script>       
       <script type="text/javascript" src="/js/visualization/markerclusterer.js"></script>
       <script type="text/javascript" src="/js/visualization/searchbox.js"></script>
       <script type="text/javascript" src="/js/visualization/searchgriddetail.js"></script>

       <script type="text/javascript" src="/js/visualization/chartreport.js"></script>

       <script type="text/javascript" src="https://www.google.com/jsapi"></script>
        <script type="text/javascript" src="/js/visualiztion/map.js"></script>
        <script type="text/javascript" src="/js/visualization/ProjectedOverlay.js"></script>
       	<script src="/js/jquery/ui/jquery.ui.core.js"></script>
	<script src="/js/jquery/ui/jquery.ui.widget.js"></script>
	<script src="/js/jquery/ui/jquery.ui.position.js"></script>
	<script src="/js/jquery/ui/jquery.ui.autocomplete.js"></script>
        <script src="/js/jquery/ui/jquery.ui.mouse.js"></script>
        <script src="/js/jquery/ui/jquery.ui.draggable.js"></script>
        <link rel="stylesheet" href="/css/jquery/theme/ui-lightness/jquery.ui.autocomplete.css"/>

       <link rel="stylesheet" href="/css/visualization/map.css"/>
       <link rel="stylesheet" href="/css/visualization/gvTooltip.css"/>
        <script src="/js/visualization/setsearchfilter.js"></script>
	<script src="/js/menu/custommenu.js"></script>
<link rel="stylesheet" href="/css/menu/custommenu.css"/>
        
	

    </head>



    <body onload="initializeMAP_V3(20.280232,38.512573, 6,document.getElementById('map_canvas'));">

        <table id="toolbarmap" cellpadding="0" cellspacing="0" style="background-color: white ; border-bottom: solid 1px white;top:0px;position: relative;">
          <tr>
              <td  align="left" style="width: 100%; padding-right: 20px;">
                  <table cellpadding="0" cellspacing="0" width="100%">
                      <tr>

                          <td style="padding-left: 20px">
                              <a style="cursor: pointer" onclick="window.location.reload();" title="Reload">  <img src="/images/24refresh.png" width="20px" height="20px"/></a>
                          </td>
                          <td style="padding-left: 10px">
                              <a style="cursor: pointer" onclick="autoLocate(20.280232,38.512573, 6);" title="Default Location">  <img src="/images/24autolocate.png" width="18px" height="18px"/></a>
                          </td>
                          <td style="padding-left: 10px">
                            <a id="markerbutton" class="markertoogle" title="Map Pointers Show/Hide"></a>
                            <input type="hidden" id="hdShowMarkers" value="1"/>
                          </td>
                          <td style="width:100%;padding-left: 10px" id="tdtestresult"> </td>

                                                </tr>
                  </table>

              </td>
              <td align="right" style="width: auto; padding-top: 0px;padding-bottom: 0px; padding-right: 2px; ">
                  <table id="toolsearchresult" align="right" style=" border: none;display: none; position: relative; top:-2px; left: 10px; width: 100px;" cellpadding="0" cellspacing="0">
                                  <tr>
                                      <td id="tdsearchresultdetail" style=" border: none; vertical-align: middle;height: 0px; " width="auto">

                                    <ul class="tabs">
                            <li style="padding-top: 4px; padding-right: 10px" ><a id="btngraph" href="#searchresultreporttab" style="background: none"> <img src="/images/24chart.png" width ="20px" height="20px" style="border: none"/></a></li>
                            <li style="padding-top: 4px;padding-right: 10px"><a id="btndata" href="#searchresultdetailtab" style="background: none"><img src="/images/24save.png" width ="20px" height="20px" style="border: none"/></a></li>
                            <li style="padding-top: 4px;padding-right: 5px"><a id="btncitation" href="#searchresultcitationtab" style="background: none"><img src="/images/24citation.png" width ="20px" height="20px" style="border: none"/></a></li>

                            </ul>
                            </td>
                            </tr>
                            </table>
              </td>

              <td align="right" style="width: auto; padding-top: 4px;padding-bottom: 4px; padding-right: 2px">
                  
                  <table id="tbSearchcontrol" cellpadding="0" cellspacing="0" width="auto">
                      <tr>

                          <td>

                              <input  id="searchbox" type="text"  class="searchbox" />
<!--                               title="Type any Species, Contributor or Location name"-->

                         </td>


                          <td>
                             <a class="trigger">
                                 <img id="imgtrigger" src="/images/up.png" width="22px" height="22px" />
                             <input type="hidden" id="hdtrigger" value="1"/>
                             </a>

                          </td>
                      </tr>
                  </table>
                 
              </td>

          </tr>

      </table>







        <div class="panel" id="searchresult">




    <table cellpadding="0" cellspacing="0" style="height: 100%; width: 100%;">

      <tr>


          <td width="320px" style="text-align: center; vertical-align: middle; " id="tdsearchresult">




          </td>
      </tr>
    </table>
</div>

<div id="panel_detail" class="panel_detail">

    <table style="position: absolute; top: 27px;">
        <tr>
             <td id="tdsearchresultdetail" style=" border:none 0px #e6e6d2; vertical-align: top;height: 0px;">
                 <div class="tab_container" style="background-color: white">

        <div id="searchresultreporttab" class="tab_content" style="background : white ;">

            <table cellpadding="0" cellspacing="0" >
            <tr>
                <td colspan="2">
                    <div style="width: 100%" align="right"><a id="btndownloadbiographdata" style="cursor: pointer; font-size: 8pt; color: #82b3d0">Download Data</a></div>
                    <div id="GraphBio_Bar" style="width: 975px;height: 150px;"></div>
                    
                </td>
            </tr>

        </table>




        </div>
                     <div id="searchresultdetailtab" class="tab_content" style="width: 975px;background : url('/images/background.jpg') ;padding-left: 80px;">
                         
                         <div style="font-family: arial; text-align: justify;font-weight: normal;font-size: 9pt;color: #191e22;width:90%">
                             <table cellpadding="5" cellspacing="5">
                                 <tr>
                                     <td style="vertical-align: top">
                                         <input type="checkbox" id="chkdownloadagreement"></input>
                                     </td>
                                     <td>
                                         You agree to cite the original citation of the data set and RBIS in all publications in which the data are used. "Data sets are provided by the RBIS, <a style="color: #1c94c4" href="http://rbis.kaust.edu.sa">http://rbis.kaust.edu.sa</a>, funded by King Abdullah University of Science and Technology
                                     </td>
                                 </tr>
                                 <tr>
                                     <td  colspan="2" style="padding-left: 35px">
                                         <a onclick="startDownload();" style="cursor: pointer"><img src="/images/download.png" style="margin: 0; padding: 0;padding-right: 5px; border: none"/><span style="font-size: 9pt; font-weight: bold; color: #99a49c">Download Data</span></a>
                                     </td>

                                 </tr>
                             </table>


                         
                         </div>

                             
                    </div>
                     <div id="searchresultcitationtab" class="tab_content" style="background : url('/images/background.jpg') ;">


        </div>
<!--                     <div align="right" style="width: 100%; "><a onclick="showhidedetails();" style="cursor: pointer;"><label style="font-size: 11px; font-family: verdana, helvetica, arial, sans-serif;color: #5375ab; padding-right: 20px;padding-bottom: 10px; cursor: pointer">Hide</label></a></div>-->
                       <input type="hidden" id="hdSearchDetails" value="0"/>
    </div>



          </td>


        </tr>
    </table>

</div>
        <div id="divsearchfilter_bio" class="ui-widget-content"></div>
        <div id="divsearchfilter_nonbio" class="ui-widget-content"></div>
        <div id="map_canvas" class="wrappingCenter">

        </div>
        <a href="" onclick="autoLocate(20.280232,38.512573, 6);">
            <div id="autolocation">
            </div>
        </a>

<div style="clear:both"></div>
    </body>
</html>
